<style type="text/css">
    .bg {
        background: #fff;
    }
    .u_header{
        padding: 12px 20px;
        border-bottom: 4px solid #eee;
    }
    .u_pic{
        width: 48px;
        height: 48px;
        border-radius: 50%;
        margin-right: 20px;
    }
    .u_header>div.lf{
        width: calc(100% - 68px);
    }
    .u_name{
        font-size: 13px;
        color: #333;
        font-weight: 700;
        margin: 3px 0;
    }
    .jifen_intro_btn img{
        width: 15px;
        height: 15px;
    }
    .jifen_intro_btn{
        font-size: 12.8px;
        color: #999;
    }
    .u_second_nav{
        padding: 12px 20px;
        border-bottom: 4px solid #eee;
    }
    .u_second_nav li{
        width: 100%;
        text-align: center;
    }
    .u_second_nav a{
        display: block;
        font-size: 16px;
    }
    .u_second_nav img{
        width: 32px;
        height: 32px;
        vertical-align: middle;
        margin-right: 4px;
    }
    .user_tabs{
        height: 49px;
        line-height: 49px;
    }
    .user_tabs img{
        width: 24px;
        height: 24px;
        margin: 13px 30px;
    }
    .items_con{
        width: calc(100% - 100px);
        border-bottom: 1px solid #cccccc;
    }
    .u_item_name{
        font-size: 12.8px;
        color: #333;
        font-weight: 700;
    }
    .u_i_arrrow{
        font-size: 12px;
        color: #9b9b9b;
    }
    .no_border{
        border-bottom: none!important;
    }
    .rule_mask{
        position: fixed;
        width: 100%;
        height: 100vh;
        background: rgba(0,0,0,.4);
        z-index: 9999999999;
        left: 0;
        top: 0;
        padding: 100px 40px 0 40px;
        display: none;
    }
    .rule_mask_con{
        background: #fff;
        border-radius: 4px;
        padding: 6px;
        position: relative;
        padding-bottom: 20px;
    }
    .close_btn{
        position: absolute;
        width: 24px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        border:1px solid #ccc;
        color: #ccc;
        right: 14px;
        top: 14px;
        font-size: 16px;
    }
    .mask_title{
        text-align: center;
        font-size: 14px;
        color: #666;
        height: 42px;
        line-height: 42px;
        font-weight: 700;
    }
    .rule_text{
        padding: 0 16px;
        text-align: justify;
        font-size: 12.8px;
        color: #666;
        line-height: 26px;
        max-height: 300px;
        overflow:auto;
    }
</style>


<!-- 积分说明弹框 -->
<div class="rule_mask">
    <div class="rule_mask_con">
        <span class="close_btn">&times;</span>
        <p class="mask_title">什么是天金商城积分？</p>
        <p class="rule_text">1、什么是天金商城积分？<br/>
            天金商城积分是天金商城商城用户在天金商城商城购物、评价、晒单、积分乐园等相关活动按情况给予的奖励，天金商城积分仅可在天金商城商城中使用，如果用户帐号暂停使用，则天金商城商城有权利取消该用户帐号内的积分，及相关使用权益。天金商城积分可直接用于支付天金商城商城的部分促销商品，具体以商城活动为准。<br/>
            2、天金商城积分如何获得？<br/>
            用户在天金商城商城中通过购买、评价、晒单、积分乐园等活动中获得天金商城积分。实际活动获得天金商城积分回馈的比例，具体以活动通知为准。<br/>
            3、天金商城积分有什么用？<br/>
            天金商城积分可在天金商城商城中兑换积分商品；也可以在积分乐园进行游戏娱乐赢取更多的积分。<br/>
            4、天金商城积分的有效期是多久？<br/>
            天金商城积分有效期为180天，即从获得积分开始计时，逾期自动作废。<br/>
            5、积分有效期说明：<br/>
            用户获得的积分,如果未使用，且在积分有效时间内，将在积分账户余额中留存。<br/>
            6、退货产生的积分如何处理？<br/>
            所有赠送积分商品属于促销活动商品，暂不支持退货退款。<br/>
            天金商城积分的最终解释权归天金商城商城所有！
        </p>
    </div>
</div>
<!--  end -->
<div class="u_header clear_fl">
    <img class="u_pic lf" src="/images/142312478575.jpg">
    <div class="lf">
        <p class="u_name">马彪</p>
        <p class="clear_fl">
            <span class="lf">积分： 445566</span>
            <span class="rt jifen_intro_btn">
                <img src="/images/jif.png">
                积分说明
            </span>
        </p>
    </div>
</div>

<ul class="u_second_nav flex-nowrap">
    <li>
        <a href="<?= url(['site/daixiaoRecord']) ?>">
            <img src="/images/huigou.png">
            我的代销
        </a>
    </li>
    <li>
        <a href="<?= url(['site/transferInt']) ?>">
            <img src="/images/zhuanzeng.png">
            积分转赠
        </a>
    </li>
</ul>


<ul class="user_tabs">
    <li>
        <a href="<?= url(['site/myOrder']) ?>" class="clear_fl">
            <img src="/images/dingdan.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">我的订单</span>
                <span class="rt u_i_arrrow">&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="<?= url(['site/ticket']) ?>" class="clear_fl">
            <img src="/images/youHuiQian.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">我的优惠券</span>
                <span class="rt u_i_arrrow">&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="<?= url(['site/verifyInfo']) ?>" class="clear_fl">
            <img src="/images/info.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">资料认证</span>
                <span class="rt u_i_arrrow">审核通过&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="<?= url(['site/myAdress']) ?>" class="clear_fl">
            <img src="/images/address.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">收货地址</span>
                <span class="rt u_i_arrrow">会员&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="" class="clear_fl">
            <img src="/images/zoushi.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">浮动点数</span>
                <span class="rt u_i_arrrow">10&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="" class="clear_fl">
            <img src="/images/yaoqinghaoyou.png" class="lf">
            <div class="lf items_con clear_fl">
                <span class="u_item_name">邀请好友</span>
                <span class="rt u_i_arrrow">&gt;</span>
            </div>
        </a>
    </li>
    <li>
        <a href="" class="clear_fl">
            <img src="/images/loginOut.png" class="lf">
            <div class="lf items_con clear_fl no_border">
                <span class="u_item_name">安全退出</span>
            </div>
        </a>
    </li>
</ul>



<script type="text/javascript">
    $(".close_btn").click(function(){
        $(this).parents(".rule_mask").hide();
    });
    $(".jifen_intro_btn").click(function(){
        $(".rule_mask").show();
    });
</script>








